<template>
	<view class="zone">
		<Header title="专属特权" color="#fff"></Header>
		<view class="main">
			<view class="tequan">
				<view class="tp1">
					当前特权
				</view>

				<image v-if="vip!=0" class="tqLevel" :src="`http://image.qxgm.site/tdz/img/zstq/n${vip}.png`"
					mode="widthFix"></image>
				<view v-else class="tdanga">
					暂无
				</view>
				<image class="tkadv"
					:src="advImg==0?'http://image.qxgm.site/tdz/img/tk/mg-13.png':'http://image.qxgm.site/tdz/img/tk/mg-14.png'"
					mode="widthFix"></image>
			</view>
			<view class="info">
				<!-- 侧边导航栏 -->
				<view class="tab">
					<view :class="['stab',stat==item.id?'act':'']" v-for="(item,index) in tablist" :key="index"
						@click="changeTab(item.id)">
						{{item.name}}
					</view>
					<!-- 广告符 -->
					<image @click="changeTab(10)" class="advimg" src="http://image.qxgm.site/tdz/img/zstq/adv.png"
						mode="widthFix">
					</image>
				</view>
				<!-- 右侧内容栏 -->
				<view class="tabInfo">

					<view class="tabLik" v-if="stat==1">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m1.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">1</span>块</p>
							<p>专属特权4:幸运值<span class="blue">+10</span></p>
							<p>专属特权5:战力<span class="blue">+2%</span></p>
							<p>专属特权6:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权7:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：完成实名认证
						</view>
						<view class="btns" v-if="show1==0">
							<view class="tqgo" @click="openTequan(1,0)">
								激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==2">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m1.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">1</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+1</span></p>
							<p>专属特权5:幸运值<span class="blue">+20</span></p>
							<p>专属特权6:战力<span class="blue">+10%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+10%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+10%</span></p>
							<p>专属特权9:每日有<span class="blue">2次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到160级或使用神石激活
						</view>
						<view class="btns" v-if="show2==0">
							<view class="tqgo2" @click="openTequan(2,2)">
								5神石激活
							</view>
							<view class="tqgo" @click="openTequan(2,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==3">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m1.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">2</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+1</span></p>
							<p>专属特权5:幸运值<span class="blue">+50</span></p>
							<p>专属特权6:战力<span class="blue">+20%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+20%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+20%</span></p>
							<p>专属特权9:每日有<span class="blue">4次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到190级或使用神石激活
						</view>
						<view class="btns" v-if="show3==0">
							<view class="tqgo2" @click="openTequan(3,2)">
								10神石激活
							</view>
							<view class="tqgo" @click="openTequan(3,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==4">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m4.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">2</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+2</span></p>
							<p>专属特权5:幸运值<span class="blue">+100</span></p>
							<p>专属特权6:战力<span class="blue">+30%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+30%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+30%</span></p>
							<p>专属特权9:每日有<span class="blue">6次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到220级或使用神石激活
						</view>
						<view class="btns" v-if="show4==0">
							<view class="tqgo2" @click="openTequan(4,2)">
								20神石激活
							</view>
							<view class="tqgo" @click="openTequan(4,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>

					</view>

					<view class="tabLik" v-if="stat==5">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m4.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">3</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+3</span></p>
							<p>专属特权5:幸运值<span class="blue">+200</span></p>
							<p>专属特权6:战力<span class="blue">+40%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+40%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+40%</span></p>
							<p>专属特权9:每日有<span class="blue">8次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到300级或使用神石激活
						</view>
						<view class="btns" v-if="show5==0">
							<view class="tqgo2" @click="openTequan(5,2)">
								30神石激活
							</view>
							<view class="tqgo" @click="openTequan(5,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==6">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m4.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">4</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+3</span></p>
							<p>专属特权5:幸运值<span class="blue">+400</span></p>
							<p>专属特权6:战力<span class="blue">+50%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+50%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+50%</span></p>
							<p>专属特权9:每日有<span class="blue">10次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到400级或使用神石激活
						</view>
						<view class="btns" v-if="show6==0">
							<view class="tqgo2" @click="openTequan(6,2)">
								50神石激活
							</view>
							<view class="tqgo" @click="openTequan(6,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==7">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m4.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">4</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+4</span></p>
							<p>专属特权5:幸运值<span class="blue">+700</span></p>
							<p>专属特权6:战力<span class="blue">+65%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+65%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+65%</span></p>
							<p>专属特权9:每日有<span class="blue">12次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到500级或使用神石激活
						</view>
						<view class="btns" v-if="show7==0">
							<view class="tqgo2" @click="openTequan(7,2)">
								100神石激活
							</view>
							<view class="tqgo" @click="openTequan(7,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==8">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m4.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">5</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+4</span></p>
							<p>专属特权5:幸运值<span class="blue">+1000</span></p>
							<p>专属特权6:战力<span class="blue">+80%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+80%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+80%</span></p>
							<p>专属特权9:每日有<span class="blue">15次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到600级或使用神石激活
						</view>
						<view class="btns" v-if="show8==0">
							<view class="tqgo2" @click="openTequan(8,2)">
								200神石激活
							</view>
							<view class="tqgo" @click="openTequan(8,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==9">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m4.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权1:开启我的团队功能</p>
							<p>专属特权2:开启赠送与市场功能</p>
							<p>专属特权3:解锁药田<span class="blue">5</span>块</p>
							<p>专属特权4:道侣房间<span class="blue">+5</span></p>
							<p>专属特权5:幸运值<span class="blue">+1500</span></p>
							<p>专属特权6:战力<span class="blue">+100%</span></p>
							<p>专属特权7:历练获得铜钱<span class="blue">+100%</span></p>
							<p>专属特权8:灵宠获得铜钱<span class="blue">+100%</span></p>
							<p>专属特权9:每日有<span class="blue">20次</span>免广告加速</p>
							<p>专属特权10:炼丹<span class="blue">100%</span>成功</p>
							<p>专属特权11:法器合成<span class="blue">100%</span>成功</p>
						</view>
						<view class="tqp">
							激活条件：御剑八荒达到700级或使用神石激活
						</view>
						<view class="btns" v-if="show9==0">
							<view class="tqgo2" @click="openTequan(9,2)">
								400神石激活
							</view>
							<view class="tqgo" @click="openTequan(9,1)">
								游戏等级激活
							</view>
						</view>
						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>
					</view>

					<view class="tabLik" v-if="stat==10">
						<image class="tqimg" src="http://image.qxgm.site/tdz/img/zstq/m10.png" mode="widthFix"></image>
						<view class="tqdes">
							<p>专属特权:激活后可以永久免看广告使用加速功能</p>
						</view>
						<view class="ahba" v-if="advImg==0">
							<view class="sjakn vis">
								<view class="tqp">
									游戏500级
								</view>
								<view class="tqgo" @click="openTequan(10,1)">
									免费激活
								</view>
							</view>
							<view class="btns">
								<view class="tqgo2" @click="openTequan(10,2)">
									88神石激活
								</view>
								<view class="tqgo2 vis" @click="openTequan(10,3)">
									88灵石激活
								</view>
							</view>
						</view>

						<image v-else class="jihuo" src="http://image.qxgm.site/tdz/img/zstq/jihuo.png" mode="widthFix">
						</image>

					</view>


				</view>
			</view>
		</view>

		<!-- 激活特权 神石解锁 -->
		<u-mask :show="sucessShow2">
			<view class="warp">
				<image class="mask1" src="http://image.qxgm.site/tdz/img/public/mask1.png" mode="widthFix"></image>
				<view class="mask_content">
					<view class="m_info">
						<view class="m_title">
							<image src="http://image.qxgm.site/tdz/img/public/l1.png" mode="widthFix" />
							<text>激活特权</text>
							<image src="http://image.qxgm.site/tdz/img/public/r1.png" mode="widthFix" />
						</view>
						<view class="jihuop">
							<view class="shuan" v-if="stat!=1">
								使用 <span>{{shenshi}}</span> <br>
							</view>
							激活 <text>{{lvName}}</text> 特权？
						</view>
						<u-button :plain="true" :hair-line="false" hover-class="none" :throttle-time="1000"
							class="confirm" @click="confirmKai">确定</u-button>
					</view>
				</view>
				<image class="m_close" @click="sucessShow2 = false" src="http://image.qxgm.site/tdz/img/public/cha.png"
					mode="widthFix" />
				<image class="mask3" src="http://image.qxgm.site/tdz/img/public/mask3.png" mode="widthFix"></image>
			</view>
		</u-mask>

		<!--激活特权 游戏等级解锁  -->
		<u-mask :show="sucessShow3">
			<view class="warp">
				<image class="mask1" src="http://image.qxgm.site/tdz/img/public/mask1.png" mode="widthFix"></image>
				<view class="mask_content">
					<view class="m_info">
						<view class="m_title">
							<image src="http://image.qxgm.site/tdz/img/public/l1.png" mode="widthFix" />
							<text>激活特权</text>
							<image src="http://image.qxgm.site/tdz/img/public/r1.png" mode="widthFix" />
						</view>
						<view class="jihuop">
							激活 <text>{{lvName}}</text> 特权？
						</view>
						<u-button :plain="true" :hair-line="false" hover-class="none" :throttle-time="1000"
							class="confirm" @click="confirmKai">确定</u-button>
					</view>
				</view>
				<image class="m_close" @click="sucessShow3 = false" src="http://image.qxgm.site/tdz/img/public/cha.png"
					mode="widthFix" />
				<image class="mask3" src="http://image.qxgm.site/tdz/img/public/mask3.png" mode="widthFix"></image>
			</view>
		</u-mask>

		<!-- 激活成功 -->
		<u-mask :show="sucessShow">
			<view class="warp">
				<image class="mask1" src="http://image.qxgm.site/tdz/img/public/mask1.png" mode="widthFix"></image>
				<view class="mask_content">
					<view class="m_info">
						<view class="m_title">
							<image src="http://image.qxgm.site/tdz/img/public/l1.png" mode="widthFix" />
							<text>激活成功</text>
							<image src="http://image.qxgm.site/tdz/img/public/r1.png" mode="widthFix" />
						</view>
						<view class="jihuop">
							恭喜您成为了尊贵的 <text>{{lvName}}</text>
							已经为您激活专属特权
						</view>
					</view>
				</view>
				<image class="m_close" @click="sucessShow = false" src="http://image.qxgm.site/tdz/img/public/cha.png"
					mode="widthFix" />
				<image class="mask3" src="http://image.qxgm.site/tdz/img/public/mask3.png" mode="widthFix"></image>
			</view>
		</u-mask>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				tablist: [{
						id: 1,
						name: '超凡脱俗',
						isrequest: false,
					},
					{
						id: 2,
						name: '天骄之王',
						shenshi: '5神石',
						isrequest: false,
					},
					{
						id: 3,
						name: '天劫高手',
						shenshi: '10神石',
						isrequest: false,
					},
					{
						id: 4,
						name: '万古仙人',
						shenshi: '20神石',
						isrequest: false,
					},
					{
						id: 5,
						name: '天启圣者',
						shenshi: '30神石',
						isrequest: false,
					},
					{
						id: 6,
						name: '绝对掌控',
						shenshi: '50神石',
						isrequest: false,
					},
					{
						id: 7,
						name: '永恒传说',
						shenshi: '100神石',
						isrequest: false,
					},
					{
						id: 8,
						name: '神界至尊',
						shenshi: '200神石',
						isrequest: false,
					},
					{
						id: 9,
						name: '永恒纪元',
						shenshi: '400神石',
						isrequest: false,
					},

				],
				stat: 1,
				sucessShow: false,
				sucessShow2: false,
				sucessShow3: false,
				lvName: '',
				show1: '',
				show2: '',
				show3: '',
				show4: '',
				show5: '',
				show6: '',
				show7: '',
				show8: '',
				show9: '',
				show10: '',
				queId: '',
				queType: '',
				vip: '',
				advImg: '',
				shenshi: '',
			}
		},
		onShow() {
			this.vipIndex()
			this.getUserInfo()
		},
		methods: {
			async getUserInfo() {
				let res = await this.$http.index.getUserInfo()
				if (res.code == 1) {
					this.vip = res.data.vip
					this.advImg = res.data.free_ad
				}
			},
			// 获取个人信息
			async vipIndex() {
				let res = await this.$http.index.vipindexList()
				if (res.code == 1) {
					this.show1 = res.data[0].state
					this.show2 = res.data[1].state
					this.show3 = res.data[2].state
					this.show4 = res.data[3].state
					this.show5 = res.data[4].state
					this.show6 = res.data[5].state
					this.show7 = res.data[6].state
					this.show8 = res.data[7].state
					this.show9 = res.data[8].state
					// this.show10 = res.data[9].state
				}
			},
			// 切换
			changeTab(id) {
				this.stat = id
			},
			// 激活确认
			openTequan(id, type) {
				if (id == 10) {
					if (type == 3) {
						this.shenshi = '88灵石'
						this.lvName = '免广告'
					} else if (type == 1) {
						this.lvName = '免广告'
					} else if (type == 2) {
						this.lvName = '免广告'
						this.shenshi = '88神石'
					}
				} else {
					this.lvName = this.tablist[id - 1].name
					this.shenshi = this.tablist[id - 1].shenshi
				}
				this.queType = type
				this.queId = id
				if (type == 0 || type == 2) {
					this.sucessShow2 = true
				} else {
					this.sucessShow3 = true
				}
			},
			// 确定激活
			async confirmKai() {
				if (this.queId == 10) {
					// 激活免广告特权
					// console.log(this.queType);
					let res = await this.$http.index.vipfreead({
						type: this.queType
					})
					if (res.code == 1) {
						this.getUserInfo()
						this.vipIndex()
						this.sucessShow2 = false
						this.sucessShow3 = false
						this.sucessShow = true
					} else {
						this.$u.toast(res.msg)
					}

				} else {
					// 激活等级特权
					let res = await this.$http.index.vipOpen({
						type: this.queType,
						id: this.queId
					})
					if (res.code == 1) {
						this.getUserInfo()
						this.vipIndex()
						this.sucessShow2 = false
						this.sucessShow3 = false
						this.sucessShow = true
					} else {
						this.$u.toast(res.msg)
					}
				}

			}
		}
	}
</script>

<style lang="less">
	.zone {
		min-height: 100vh;
		background: url(http://image.qxgm.site/tdz/img/public/p_bg.png) no-repeat;
		background-size: 100% auto;
	}

	.vis {
		visibility: hidden;
	}

	.main {
		height: calc(100vh - 70px);
	}

	.tequan {
		position: relative;
		background: url(http://image.qxgm.site/tdz/img/zstq/z_bg.png) no-repeat;
		background-size: 100% 100%;
		margin: 0 5px;
		text-align: center;
		padding: 45px 0 25px;
	}

	.tkadv {
		position: absolute;
		top: 44%;
		right: 14%;
		width: 40px;
	}

	.tp1 {
		font-size: 16px;
		font-weight: normal;
		color: #FFFED0;
		line-height: 16px;
	}

	.tqLevel {
		width: 51%;
		display: block;
		margin: 0 auto;
	}

	.tdanga {
		font-size: 16px;
		font-weight: normal;
		color: #FFFED0;
		line-height: 16px;
		padding: 31px 0;
	}

	.info {
		display: flex;
		justify-content: space-between;
		background: url(http://image.qxgm.site/tdz/img/public/info.png) no-repeat;
		background-size: 100% 100%;
		padding: 20px 6px 30px 12px;
		height: calc(100% - 164px);
		box-sizing: border-box;
	}

	.blue {
		color: #FF00FF;
		font-style: italic;
	}

	.tab {
		position: relative;
		width: 27%;
	}

	.advimg {
		position: absolute;
		width: 60%;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
	}

	.tabInfo {
		width: calc(73% - 3px);
		background: url(http://image.qxgm.site/tdz/img/zstq/tqbg.png) no-repeat;
		background-size: 100% 100%;
		height: calc(100%);
		overflow-y: scroll;
	}

	.stab {
		width: 100%;
		text-align: center;
		font-size: 14px;
		font-weight: normal;
		color: #FFFED0;
		line-height: 27px;
		background: url(http://image.qxgm.site/tdz/img/public/tab2.png) no-repeat;
		background-size: 100% 100%;
		margin-bottom: 6px;
	}

	.act {
		color: #A97D45;
		background: url(http://image.qxgm.site/tdz/img/public/tab1.png) no-repeat;
		background-size: 100% 100%;
	}

	.tabInfo {
		padding: 16px 12px 22px 13px;
	}

	.tqimg {
		width: 47%;
		display: block;
		margin: 0 auto 3vh;
	}

	.tqdes {
		p {
			font-size: 14px;
			font-weight: normal;
			color: #333333;
			line-height: 14px;
			margin-bottom: 3vh;
		}

	}

	.tqp {
		font-size: 12px;
		color: #666;
		line-height: 20px;
		font-weight: 500;
	}

	.sjakn {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-bottom: 20px;
	}

	.btns {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.tqgo2 {
		width: 49%;
		text-align: center;
		float: right;
		font-size: 15px;
		font-weight: normal;
		color: #b0e8f3;
		line-height: 37px;
		height: 37px;
		text-shadow: 0 1px 1px #006599;
		background: url(http://image.qxgm.site/tdz/img/ceo/mg-05.png) no-repeat;
		background-size: 100% 100%;
	}

	.tqgo {
		width: 49%;
		text-align: center;
		float: right;
		font-size: 16px;
		font-weight: normal;
		color: #fdf2c5;
		line-height: 37px;
		height: 37px;
		text-shadow: 0 1px 1px #CB6500;
		background: url(http://image.qxgm.site/tdz/img/public/anniu.png) no-repeat;
		background-size: 100% 100%;
	}

	.jihuo {
		display: block;
		margin: 0 auto;
		width: 47%;
	}

	.jihuop {
		display: block;
		margin: 2vh auto 0;
		width: 67%;
		font-size: 15px;
		font-weight: normal;
		color: #50433A;
		line-height: 24px;
		text-align: center;


		text {
			font-size: 18px;
			font-weight: normal;
			font-style: italic;
			color: #50433A;
			line-height: 24px;
			background: linear-gradient(0deg, #FF15E6 0%, #FF7800 95.1171875%);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}

		span {
			color: #FF6699;
		}
	}

	.confirm {
		display: block;
		margin: 14px auto 0;
		width: 116px;
		height: 37px;
		text-align: center;
		line-height: 37px;
		font-size: 18px;
		font-weight: normal;
		color: #fdf0c4;
		text-shadow: 0 1px 1px #CB6500;
		background: url(http://image.qxgm.site/tdz/img/youchai/mg-04.png) no-repeat;
		background-size: 100% 100%;
	}
</style>